<template>
  <el-dialog
    title="详情"
    :close-on-click-modal="false"
    :visible.sync="visible"
    width="60%">
    <el-form>
      <el-button type="small" @click="addClaim()">新增</el-button>
      <el-button type="small" @click="deleteClaim()"  :disabled="dataListSelections.length <= 0">批量删除</el-button>
    </el-form>
      <el-table
      :data="dataList"
      border
      @selection-change="selectionChangeHandle">
        <el-table-column type="selection" align="center" width="50" />
        <el-table-column label="项目" prop="inspectionItem" align="center"/>
        <el-table-column label="标准" prop="inspectionStandard" align="center"/>
        <el-table-column label="巡查时间" prop="updateTime" align="center"/>
        <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="addClaim(scope.row)">修改</el-button>
            <el-button type="text" @click="deleteClaim(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

    <el-dialog
      :title="!dataForm.id ? '新增' : '修改'"
      :close-on-click-modal="false"
      :visible.sync="claminvisible"
      append-to-body>
      <el-form :model="dataForm" label-width="80px" ref="dataForm" :rules="rules">
        <el-form-item label="检查项目" prop="inspectionItem">
          <el-input v-model="dataForm.inspectionItem" />
        </el-form-item>
        <el-form-item label="检查标准" prop="inspectionStandard">
          <el-input type="textarea" v-model="dataForm.inspectionStandard"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
      <el-button @click="claminvisible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
    </el-dialog>
  </el-dialog>
</template>

<script>
  export default {
    name: 'device-claim',
    data () {
      return {
        visible: false,
        claminvisible: false,
        dataList: [],
        dataListSelections: [],
        dataForm: {
          id: '',
          inspectionStandard: '',
          inspectionItem: ''
        },
        deviceId: '',
        rules: {
          inspectionStandard: [
            { required: true, message: '标准不能为空', trigger: 'blur' }
          ],
          inspectionItem: [
            { required: true, message: '项目不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init(id) {
        this.deviceId = id
        this.visible = true
        this.getList()
      },
      contentChanged(val) {
        this.dataForm.inspectionStandard = val
      },
      async addClaim(row) {
        this.claminvisible = true
        this.dataForm.id = ''
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
        })
        if (row) {
          let res = await this.$http.post(`/device/respon/stand/info/${row.id}`)
          this.dataForm = res.data
        }
      },
      selectionChangeHandle(val) {
        this.dataListSelections = val
      },
      async getList() {
        const res = await this.$http.post('/device/respon/stand/list', {
          deviceId: this.deviceId
        })
        if (res.code === 200) {
          this.dataList = res.data
        }
      },
      async dataFormSubmit() {
        var isValid = await this.$refs.dataForm.validate()
        if (!isValid) return
        let res = await this.$http({
          url: this.$http.adornUrl(`/device/respon/stand/${!this.dataForm.id ? 'save' : 'update'}`),
          method: 'post',
          data: {
            id: this.dataForm.id,
            deviceId: this.deviceId,
            inspectionStandard: this.dataForm.inspectionStandard,
            inspectionItem: this.dataForm.inspectionItem
          }
        })
        if (res.code === 200) {
          this.claminvisible = false
          this.dataList = res.data.list
          this.getList()
        }
      },
      async deleteClaim(id) {
        var ids = id || this.dataListSelections.map(item => item.id).join(',')
        var confirm = await this.$confirm(`确定要进行删除操作吗?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        if (confirm !== 'confirm') return

        let res = await this.$http({
          url: '/device/respon/stand/delete',
          method: 'post',
          data: {
            ids: ids
          }
        })
        if (res && res.code === 200) {
          this.$notify.success({ title: '成功', message: '删除成功' })
          this.pageIndex > 1 && this.dataList.length <= 1 && this.pageIndex --
          this.getList()
        } else {
          this.$notify.error({ title: '错误', message: res.msg })
        }
      }
    }
  }
</script>

<style scoped>

</style>
